<!DOCTYPE html>
<html>
<<template "_head.html">>

<el-main style="background-color: #F5F5F5;">

		    	<el-row :gutter="20" style="margin-bottom: 8px;">
          <el-col :span="24"><div class="grid-content host_table">
              <h4> > 资产列表</h4>
              <template>
              <el-table
                :data="tableData"
                :row-class-name="tableRowClassName"
                height="84%"
                border
                stripe
                style="width: 100%">
                <el-table-column
                  prop="date"
                  label="name"
                  width="180">
                </el-table-column>
                <el-table-column
                  prop="name"
                  label="IP"
                  width="180">
                </el-table-column>
                <el-table-column
                  prop="address"
                  label="平台">
                </el-table-column>
                <!--cpu  mem  -->
                 <el-table-column
                  fixed="right"
                  label="操作"
                  width="200">
                  <template slot-scope="scope">
                    <el-button @click="handleClick(scope.row)" type="text" size="small">详情</el-button>
                    <el-button type="text" size="small">已读</el-button>
                    <el-button type="text" size="small">监控</el-button>
                    <el-button type="text" size="small">通知</el-button>
                  </template>
                </el-table-column>
              </el-table>
            </template>

          </div></el-col>
        </el-row>
				

		    </el-main>

		 <!--  <el-footer style="background-color: #000; " >aas</el-footer> -->
		</el-container>

	</div>

</body>

<script type="text/javascript">
let url = window.location.pathname;
new Vue({
	el:"#app",
	data:{
	     menu:Enum(url),
	     tableData: [{
            date: '2016-05-02',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1518 弄',
          }, {
            date: '2016-05-04',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1517 弄',
          }, {
            date: '2016-05-01',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1519 弄',
          }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄',
          }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄',
          }, {
            date: '2016-05-03',
            name: '王小虎',
            address: '上海市普陀区金沙江路 1516 弄',
          }]
	},
	methods:{
		handleSelect(key, keyPath) {
        	console.log(key, keyPath);
      	},
      	handleOpen(key, keyPath) {
	        console.log(key, keyPath);
	        window.location.href=keyPath;
	    },
	    handleClose(key, keyPath) {
	        console.log(key, keyPath);
	    },
	     tableRowClassName({row, rowIndex}) {
	     	console.log(row)
        if (row.type === 1) {
          return 'warning-row';
        } else if (row.type === 3) {
          return 'success-row';
        }
        return '';
      },
      handleClick(row) {
        console.log(row);
      }
	}
})
</script>

</html>